﻿@inherits AdminCompontentBase

<DefaultSheetDialog Value="Visible" ValueChanged=UpdateVisible Title="@T("Staff Sync")">
    <AutoHeight Overflow>
        <AutoHeightContent>
            <label class="uploadImage" for="upload">
                 <InputFile accept="text/csv" OnChange="OnFileChange" id="upload" />
                 <STextField Readonly Outlined=false Dense=false Value="File?.Name" Style="pointer-events: none;" PrependIcon="mdi-paperclip" />               
            </label>
            <div class="mt-6">
                <div>@T("Explanation")</div>
                <div>@T("File size limit")：@MaxFileSize MB</div>
                <div>@T("Gender")：@T("Male/Female")</div>
                <div>@T("StaffType")：@($"{T("InternalStaff/ExternalStaff")}({T("Default to internal staff")})")</div>
                <div>@T("Password")：@T("Add employee: the password is the default password, editing employee: the password remains the same as the original password.")</div>
            </div>
            <div class="d-flex mt-12">
                <a target="_blank" href="https://cdn.masastack.com/stack/auth/csv/StaffSyncTemplate.csv">
                    @T("StaffSyncTemplate")
                </a>
                <MSpacer />               
            </div>
            @if (SyncStaffResults is not null && SyncStaffResults.IsValid)
            {
                foreach (var result in SyncStaffResults.Results)
                {
                    <div class="mt-6">
                        <div>@T("Line")：@(result.Index+2)</div>
                        <div>@T("JobNumber")：@result.JobNumber</div>
                        <div>@T("Error Info")：</div>
                        <div>
                            @foreach (var error in result.Errors)
                            {
                                <div class="error--text">@T(error)</div>
                            }
                        </div>
                    </div>
                }
            }
        </AutoHeightContent>
        <FooterContent>
            <div class="d-flex mt-6">
                <MSpacer />
                <SButton Small OnClick=SyncAsync>@T("Sync")</SButton>
            </div>
        </FooterContent>
    </AutoHeight>
</DefaultSheetDialog>